import React from 'react'
import { Grid,Image} from 'react-vant';
import {
    useNavigate
} from "react-router-dom"

function Tabs_content({tab_listChildren}) {
    const navigate = useNavigate()
    
    const goto_detail = (val) =>{
        navigate("/detail/"+val.id,{state:val})
    }
    return (
        <Grid border={false} columnNum={2}>
            {
                tab_listChildren&&tab_listChildren.length>0?tab_listChildren.map((val,i)=>{
                    return  <Grid.Item key={i} onClick={()=>goto_detail(val)}>
                    <Image lazyload width="100" height="100" errorIcon={<div style={{ fontSize: 14 }}>加载失败</div>} src={val.img} />
                    <p>{val.itle}</p>
                    <p>价格{val.price}</p>
                    <p>数量{val.count}</p>
                </Grid.Item>
                }):"暂无数据"
            }
        </Grid>
    )
}

export default Tabs_content
